DOM Attributes

In this tutorials, we will learn how to get an attribute value, set an attribute value, remove an attribute value and check whether the attribute is present or not.
The following methods are used to perform the above operations
setAttribute() - Used to set the value of the attribute of an element.
getAttribute() - Used to get the value of the attribute of an element.
removeAttribute() - Used to remove an attribute of an element.
hasAttribute() - Check whether the attribute is present or not in the element.

Example

<!DOCTYPE html>
<html>
   <body>
      <button>Save All</button>
      <script>
         const button = document.querySelector("button");
         
         button.setAttribute("name", "saveButton");
         button.setAttribute("disabled", "");
         
         // getting the attribute value
         console.log(button.getAttribute("name")); // saveButton
         
         // removing the attribute 'name' in the element.
         button.removeAttribute("name");
         
         // check for the attribute 'name' in the element.
         console.log(button.hasAttribute("name")); // false
             
      </script>
   </body>
</html>

Most Read